Layer anordnen und kontrollieren |
|
Angaben zur Schichtposition mit Layer-Namen |
|
Anzeigebeispiel: So sieht's aus
Wenn Sie mehrere Layer in einer HTML-Datei definieren, deren Anzeigebereiche sich überlappen, werden die Layer normalerweise in der Reihenfolge übereinander angezeigt, in der sie definiert werden. Sie können jedoch die Reihenfolge ändern und angeben, welcher andere Layer unmittelbar über oder unter dem aktuellen Layer liegen soll. Auf diese Weise können Sie das Überdecken von Layern kontrollieren. Voraussetzung ist, daß Sie für jeden Layer einen Namen vergeben.
<layer id="Erster" left=100 top=100> <img src="datei1.gif" alt="Ein Bild"> </layer> <layer id="Zweiter" left=150 top=150 above="Erster"> <img src="datei2.gif" alt="Ein anderes Bild"> </layer> <layer id="Dritter" left=200 top=200 below="Erster"> <img src="datei3.gif" alt="Ein ganz anderes Bild"> </layer> |
Mit dem Attribut above= im einleitenden <layer>- oder <ilayer>-Tag können Sie bestimmen, daß ein zuvor definierter, benannter Layer unmittelbar über dem aktuellen Layer liegt (above = oberhalb). Das heißt, der aktuelle Layer soll bei Überschneidung von dem genannten Layer überdeckt werden.
Mit dem Attribut below= im einleitenden <layer>- oder <ilayer>-Tag können Sie bestimmen, daß ein zuvor definierter, benannter Layer unmittelbar unter dem aktuellen Layer liegt (below = unterhalb). Das heißt, der aktuelle Layer soll bei Überschneidung den genannten Layer überdecken.
Die Layernamen hinter above= und below= sollten in Anführungszeichen stehen.
Bei above= und below= dürfen Sie nur Namen von Layern angeben, die in der Datei bereits zuvor definiert wurden. Die Angabe von Layern, die erst nach dem aktuellen Layer definiert werden, kann zu Anzeigefehlern führen. Im ersten definierten Layer einer HTML-Datei sollten deshalb keine Angaben zu above= oder below= vorkommen.
Es ist nur je eine Angabe für above= und below= bei der Definition eines Layers erlaubt. Denn mit diesen Angaben legen Sie immer nur fest, welcher andere Layer direkt unter oder über dem aktuellen Layer angezeigt werden soll.
Anzeigebeispiel: So sieht's aus
Wenn Sie mehrere Layer in einer HTML-Datei definieren, deren Anzeigebereiche sich überlappen, werden die Layer normalerweise in der Reihenfolge übereinander angezeigt, in der sie definiert werden. Sie können die Reihenfolge ändern, indem Sie für die einzelnen Layer Nummern vergeben. Layer mit höherer Nummer überdecken Layer mit niedrigerer Nummer.
<layer name="Erster" left=100 top=100 z-index=2> <img src="datei1.gif" alt="Ein Bild"> </layer> <layer name="Zweiter" left=150 top=150 z-index=1> <img src="datei2.gif" alt="Ein anderes Bild"> </layer> <layer name="Dritter" left=200 top=200 z-index=3> <img src="datei3.gif" alt="Ein ganz anderes Bild"> </layer> |
Mit dem Attribut z-index= im einleitenden <layer>- oder <ilayer>-Tag bestimmen Sie die Reihenfolge der Layer bei Überlappungen (z-index = Reihenfolge). Geben Sie bei jedem definierten Layer z-index= und dahinter eine Nummer an. Der Layer mit der höchsten Nummer überdeckt alle anderen. Der Layer mit der niedrigsten Nummer wird von allen anderen überdeckt.
Bei den Angaben zu z-index= sind auch negative Werte erlaubt. Dadurch bewirken Sie bei verschachtelten Layern, daß Layer, die innerhalb eines anderen Layers definiert werden, von ihren "Eltern"-Layern überdeckt werden. Bei positiven Zahlen ist dies umgekehrt.
Anzeigebeispiel: So sieht's aus
Sie können bei der Definition von Layern festlegen, ob diese zunächst angezeigt werden sollen oder nicht. Das ist von Bedeutung, wenn Sie die Anzeige der Layer mit Hilfe von JavaScript dynamisch ein-/ausschalten wollen.
<layer name="Erster" left=100 top=100 visibility=show> <img src="datei1.gif" alt="Ein Bild"> </layer> <layer name="Zweiter" left=120 top=200 visibility=hide> <img src="datei2.gif" alt="Ein anderes Bild"> </layer> |
Mit dem Attribut visibility= im einleitenden <layer>- oder <ilayer>-Tag können Sie die Anzeige des Layers explizit erzwingen oder verhindern (visibility = Sichtbarkeit).
Mit visibility=show legen Sie fest, daß der Layer in jedem Fall angezeigt wird (show = zeigen).
Mit visibility=hide legen Sie fest, daß der Layer nicht angezeigt, also versteckt wird (hide = verstecken).
Mit visibility=inherit legen Sie fest, daß der Layer nur dann angezeigt wird, wenn sein "Eltern"-Element ebenfalls angezeigt wird (inherit = erben). Diese Angabe ist nur bei inneren Layern in verschachtelten Layern von Bedeutung.
weiter: | Style-Sheet-Bereiche in HTML |
zurück: | Hintergrund von Layern |